<template>
    <div>
        <navigator :level="level" :pathName="pathName"></navigator>
        <div class="content">
            <el-table :data="users" border style="width: 100%" @selection-change="handleSelectionChange">
                <el-table-column type="selection" width="50">
                </el-table-column>
                <el-table-column prop="account" label="账号" width="180">
                </el-table-column>
                <el-table-column prop="name" label="姓名" width="180">
                </el-table-column>
                <el-table-column prop="telephone" label="电话">
                </el-table-column>
                <el-table-column prop="loginTime" label="登录时间">
                </el-table-column>
                <el-table-column prop="lastTime" label="最近一次登录时间">
                </el-table-column>
            </el-table>
            <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
                           :current-page="currentPage" :page-sizes="pageSizes" :page-size="pageSize"
                           layout="total, sizes, prev, pager, next, jumper" :total="total">
            </el-pagination>
        </div>
    </div>
</template>

<script>
    import Navigator from '../../common/navigator.vue';

    export default {
        data () {
            return {
                level: 1,
                pathName: '用户列表',
                users: [],
                currentPage: 1,
                pageSizes: [10, 20, 30],
                pageSize: 10,
                total: 0
            };
        },
        components: {
            Navigator
        },
        methods: {
            handleSelectionChange (val) {

            },
            handleSizeChange (val) {
                console.log(`每页 ${val} 条`);
            },
            handleCurrentChange (val) {
                console.log(`当前页: ${val}`);
            }
        },
        mounted(){
            let loading = this.$loading({
                target: '.content',
                fullscreen: false,
                text: '拼命加载中'
            });
            this.$http.get('/admin/user/index').then((response) => {
                if (response.ok) {
                    let data = response.data.data;
                    this.users = data.data;
                    this.currentPage = data.currentPage;
                    this.pageSize = data.numsPerPage;
                    this.total = data.totalPages;
                } else {
                    console.error(response);
                }
                loading.close();
            }, (response) => {
                console.error(response);
                loading.close();
            });
        }
    };
</script>

<style scoped>

</style>
